page {
  // background-image: url("./assets/1719997795175.jpg");
  background-size: cover;
  background-position: left top;
  padding         : 14px;
  box-sizing      : border-box;
  color           : #333;
}

.wrapper {
  background: #E7E5E1;
  position: fixed;
  top:0;
  right:0;
  bottom:0;
  left: 0;
  display: flex;
  flex-direction: column;
}

.turntable {
  width: 20rem;
  height: 20rem;
  position: relative;

  .icons {
    border-radius: 100%;
    width: 100%;
    height: 100%;
    // background: #000;
  }

  .rotate {
    animation: _rotate 2s linear infinite;
  }

  .item {
    position: absolute;
    width: 5rem;
    height: 5rem;
    background: #E7E6E1;
  }

  .item:nth-child(1) {
    top: 0;
    left: calc(100% / 2 - 6rem);
    transform: rotate(-30deg);
  }

  .item:nth-child(2) {
    top: 0;
    left: calc(100% / 2 + 0.5rem);
    transform: rotate(30deg);
  }

  .item:nth-child(3) {
    top: calc(100% / 2 - 6rem);
    right: 0;
    transform: rotate(-30deg);
  }
  .item:nth-child(4) {
    top: calc(100% / 2 + 0.5rem);
    right: 0;
    transform: rotate(30deg);
  }

  .item:nth-child(5) {
    right: calc(100% / 2 - 6rem);
    bottom: 0;
    transform: rotate(-30deg);
  }
  .item:nth-child(6) {
    right: calc(100% / 2 + 0.5rem);
    bottom: 0;
    transform: rotate(30deg);
  }

  .item:nth-child(7) {
    top: calc(100% / 2 - 6rem);
    left: 0;
    transform: rotate(30deg);
  }
  .item:nth-child(8) {
    top: calc(100% / 2 + 0.5rem);
    left: 0;
    transform: rotate(-30deg);
  }

  .item-icon {
    width: 100%;
    height: 100%;
  }
}

.content {
  flex-grow: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ad {
  height: 4rem;
  flex-shrink: 0;
  text-align: center;
}

.button {
  background-color: transparent;
  border-radius   : 100%;
}

.power {
  position: absolute;
  width           : 3rem;
  height: 3rem;
  left: calc(100% / 2 - 1.5rem);
  top: calc(100% / 2 - 1.5rem);
  background: #fff;
}

@keyframes _rotate {
  0% {
    transform: rotate(0);
  }

  50% {
    transform: rotate(180deg);
  }
  100% {
    transform: rotate(359deg);
  }
}